import 'package:flutter/material.dart';

class TestFreash extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _TestFreash();
  }
}

class _TestFreash extends State<TestFreash> {

  List<DropdownMenuItem> getListData() {
    List<DropdownMenuItem> items = new List();
    DropdownMenuItem dropdownMenuItem1 = new DropdownMenuItem(
      child: new Text('1'),
      value: '1',
    );
    items.add(dropdownMenuItem1);
    DropdownMenuItem dropdownMenuItem2 = new DropdownMenuItem(
      child: new Text('2'),
      value: '2',
    );
    items.add(dropdownMenuItem2);
    DropdownMenuItem dropdownMenuItem3 = new DropdownMenuItem(
      child: new Text('3'),
      value: '3',
    );
    items.add(dropdownMenuItem3);
    return items;
  }

  var value;

  // 设置默认的值
  _LearnDropdownButton(){
    value=getListData()[1].value;
  }

  void initState() {
    super.initState();
    _LearnDropdownButton();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(),
      body: Stack(
        children: <Widget>[
          _headerWidget(),
          _bodyWidget()
        ],
      )
    );
  }

  Widget _headerWidget() {
    return Container(
      height: 50,
      decoration: BoxDecoration(
        border: Border.all(width: 1,color: Colors.redAccent)
      ),
      child: Row(
        children: <Widget>[
          Container(
            width: 90,
            margin: EdgeInsets.only(right: 20),
            decoration: BoxDecoration(
              border: Border(
                right: BorderSide(width: 1,color: Colors.redAccent)
              )
            ),
            child: new DropdownButton(

              items: getListData(),
              hint:new Text('下拉选择你想要的数据'),//当没有默认值的时候可以设置的提示
              value: value,//下拉菜单选择完之后显示给用户的值
              onChanged: (T){//下拉菜单item点击之后的回调
                setState(() {
                  value=T;
                });
              },
              elevation: 24,//设置阴影的高度
              style: new TextStyle(//设置文本框里面文字的样式
                  color: Colors.red
              ),
//              isDense: false,//减少按钮的高度。默认情况下，此按钮的高度与其菜单项的高度相同。如果isDense为true，则按钮的高度减少约一半。 这个当按钮嵌入添加的容器中时，非常有用
              iconSize: 30.0,//设置三角标icon的大小
              isExpanded: true,
            ),
          ),
          Container(
            width: 90,
            child: new DropdownButton(

              items: getListData(),
              hint:new Text('下拉选择你想要的数据'),//当没有默认值的时候可以设置的提示
              value: value,//下拉菜单选择完之后显示给用户的值
              onChanged: (T){//下拉菜单item点击之后的回调
                setState(() {
                  value=T;
                });
              },
              elevation: 24,//设置阴影的高度
              style: new TextStyle(//设置文本框里面文字的样式
                  color: Colors.red
              ),
//              isDense: false,//减少按钮的高度。默认情况下，此按钮的高度与其菜单项的高度相同。如果isDense为true，则按钮的高度减少约一半。 这个当按钮嵌入添加的容器中时，非常有用
              iconSize: 30.0,//设置三角标icon的大小
              isExpanded: true,
            ),
          ),
          Container(
            width: 90,
            child: new DropdownButton(

              items: getListData(),
              hint:new Text('下拉选择你想要的数据'),//当没有默认值的时候可以设置的提示
              value: value,//下拉菜单选择完之后显示给用户的值
              onChanged: (T){//下拉菜单item点击之后的回调
                setState(() {
                  value=T;
                });
              },
              elevation: 24,//设置阴影的高度
              style: new TextStyle(//设置文本框里面文字的样式
                  color: Colors.red
              ),
//              isDense: false,//减少按钮的高度。默认情况下，此按钮的高度与其菜单项的高度相同。如果isDense为true，则按钮的高度减少约一半。 这个当按钮嵌入添加的容器中时，非常有用
              iconSize: 30.0,//设置三角标icon的大小
              isExpanded: true,
            ),
          ),

        ],
      ),
    );
  }

  Widget _bodyWidget() {
    return Container(
      height: 400,
      padding: EdgeInsets.only(top: 55),
      child: Column(
        children: <Widget>[
          Text('aaaaa')
        ],
      ),
    );
  }


}
